import {getImageData} from "../utils";

export default {
  click(){
    this.zoomScale = 0
    this.scale = 1
    this.zoom_width = 0
    if(!this.rotate){
      this.rotate = 0
    }
    this.rotate += 90;
    if(this.rotate % 90 === 0){
      this.canvas.width = this.image.height
      this.canvas.height = this.image.width
      let width = this.canvas.width;
      let height = this.canvas.height;
      this.ctx.clearRect(0, 0, width , height)
      // 先位移坐标到中心
      this.ctx.translate(width / 2, height / 2);
      // 旋转90度
      this.ctx.rotate(this.rotate * Math.PI / 180);
      // 此时按照旋转后的尺寸
      // 把定位中心移动到左上角
      this.ctx.translate(-1 * height / 2, -1 * width / 2);
      // 绘制图片
      this.ctx.drawImage(this.image, 0, 0, height, width);
      // 坐标系还原到初始
      this.ctx.setTransform(1, 0, 0, 1, 0, 0);
      this.canvasBox.style.width = width + 'px'
      this.canvasBox.style.height = height + 'px';
    }

    if(this.rotate % 180 === 0){
      this.canvas.width = this.image.width
      this.canvas.height = this.image.height
      let width = this.canvas.width;
      let height = this.canvas.height;
      this.ctx.clearRect(0, 0, width , height)
      // 先位移坐标到中心
      this.ctx.translate(width / 2, height/ 2);
      // 旋转90度
      this.ctx.rotate(this.rotate * Math.PI / 180);
      // 此时按照旋转后的尺寸
      // 把定位中心移动到左上角
      this.ctx.translate(-1 * width / 2, -1 * height / 2);
      // 绘制图片
      this.ctx.drawImage(this.image, 0, 0, width, height);
      // 坐标系还原到初始
      this.ctx.setTransform(1, 0, 0, 1, 0, 0);
      this.canvasBox.style.width = width + 'px'
      this.canvasBox.style.height = height + 'px';
    }
    this.imgDataOld = getImageData(this.canvas);
    this.canvasRect = this.canvas.getBoundingClientRect();
    this.restDraw()
  },
  canvasMousedown(e){},
  canvasMouseup(e){},
  canvasMouseout(e){},
  canvasTouchstart(e){},
  canvasTouchend(e){},
  winMouseup(){},
  winMousemove(e){},
  winTouchend(e){},
  visibilitychange(){}
}
